<template>
	<div>
		<slot v-if="showSlot" :userPermissions="permissions"> </slot>
	</div>
</template>

<script lang="ts" setup>
import { ref, computed } from "vue";
const props = defineProps<{
	permission: string | string[];
}>();
// const permissions = ref<string[]>(JSON.parse(localStorage.getItem("permissions")!) || []);
const permissions = ref<string[]>(["competiton:get", "competiton:set"]);
const showSlot = computed(() => {
	if (!props.permission) {
		return true;
	}
	if (!permissions.value) {
		return false;
	}
	if (Array.isArray(props.permission)) {
		return props.permission.every(v => permissions.value.includes(v));
	} else {
		return permissions.value.includes(props.permission);
	}
});
</script>
